<script setup>

import { ElButton } from 'element-plus';

</script>
<template>
  <div class="action-buttons">
    <el-row gutter="24" class="botton-view">
      <!-- 分享话题按钮 -->
      <el-col :span="8">
        <el-button
            type="text"
            @click="handleShare"
        >
          <el-icon><Share /></el-icon>
          分享话题
        </el-button>
      </el-col>

      <!-- 生成海报按钮 -->
      <el-col :span="8">
        <el-button
            type="text"
            @click="handleGeneratePoster"
        >
        <el-icon><Download /></el-icon>
        生成海报
        </el-button>
      </el-col>


      <el-col :span="8">
        <el-button
            type="primary"
            icon="Edit"
            @click="handleJoinDiscussion"
            class="discussion-btn"
        >
          参与讨论
        </el-button>
      </el-col>
    </el-row>
  </div>
</template>


<style scoped>
.action-buttons {
  position: fixed;
  bottom: 0;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #f5f5f5;
  width: 100%;
}

.botton-view {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 10px 0;
}

</style>